<%@include file="../../generic/inc/head.jsp"%>

<!-- Import dojo -->
<%@include file="../../generic/inc/importdojo.jsp"%>

<%@ page import="fr.mywiki.view.web.struts.form.modeling.EditModelForm" %>
<%@ page import="fr.mywiki.business.entry.meta.Property" %>

<script>
<!--
function addProperty() {
	document.forms["editModelForm"].propertyAction.value='<%=EditModelForm.PROPERTY_ACTION_CREATION%>';
	
	document.getElementById('nameInput').value="";
	document.getElementById('typeInput').value="";
	updatePropertyType();
	
	document.getElementById('useMinInput').checked=false;
	document.getElementById('minValInput').value="";
	
	document.getElementById('useMaxInput').checked=false;	
	document.getElementById('maxValInput').value="";

	document.getElementById('requiredInput').checked=false;
	
	dojo.byId('errorEdition').innerHTML = "";
	

	dijit.byId('dialogEdition').show();
}

function removeProperty(index) {
	if(confirm('<bean:message key="model.edit.property.remove.confirm"/>')) {
		cancelProperty(index);
	}
}

function cancel() {
	document.forms["editModelForm"].method.value='cancel';
	document.forms["editModelForm"].submit();	
}

function validate() {
	document.forms["editModelForm"].method.value='validate';
	document.forms["editModelForm"].submit();	
}

function validateProperty() {
	// Check if property is correct
	document.forms["editModelForm"].method.value='validateProperty';

	document.forms["editModelForm"].editedName.value = document.getElementById('nameInput').value;
	document.forms["editModelForm"].editedType.value = document.getElementById('typeInput').value;

	document.forms["editModelForm"].editedUseMaxValue.value = document.getElementById('useMaxInput').checked;
	document.forms["editModelForm"].editedUseMinValue.value = document.getElementById('useMinInput').checked;
	document.forms["editModelForm"].editedMaxValue.value = document.getElementById('maxValInput').value;
	document.forms["editModelForm"].editedMinValue.value = document.getElementById('minValInput').value;

	var isRequired = document.getElementById('requiredInput').checked;
	if(isRequired)
		document.forms["editModelForm"].editedRequired.value = "required";
	else
		document.forms["editModelForm"].editedRequired.value = "";

	dojo.xhrPost( {
		url: "editModel.do",
		handleAs: "text",
		timeout: 5000,
		form: document.editModelForm,
		load: function(response, ioArgs) {
			if (response == "OK") {
				dijit.byId('dialogEdition').hide();
				document.forms["editModelForm"].method.value='redisplay';
				document.forms["editModelForm"].submit();
			} else {
				dojo.byId('errorEdition').innerHTML = response;
			}
			return response;
		},
		error: function(response, ioArgs) {
			console.error("HTTP status code: ", ioArgs.xhr.status);
			return response;
		}
	});
}

function modifyProperty(index) {
	document.forms["editModelForm"].method.value='modifyProperty';
	document.forms["editModelForm"].savedIndex.value=index;
	dojo.xhrPost( {
		url: "editModel.do",
		handleAs: "json",
		timeout: 5000,
		form: document.editModelForm,
		load: function(response, ioArgs) {
			document.getElementById('nameInput').value=response.name;
			document.getElementById('typeInput').value=response.type;
			updatePropertyType();
			if(response.useMin == "true")
				document.getElementById('useMinInput').checked=true;
			else
				document.getElementById('useMinInput').checked=false;
				
			document.getElementById('minValInput').value=response.minVal;
			
			if(response.useMax == "true")
				document.getElementById('useMaxInput').checked=true;
			else
				document.getElementById('useMaxInput').checked=false;
			
			document.getElementById('maxValInput').value=response.maxVal;
			
			if(response.required == "true")
				document.getElementById('requiredInput').checked=true;
			else
				document.getElementById('requiredInput').checked=false;
			
			dojo.byId('errorEdition').innerHTML = "";
			
			document.forms["editModelForm"].propertyAction.value='<%=EditModelForm.PROPERTY_ACTION_MODIFICATION%>';
			dijit.byId('dialogEdition').show();
			return response;
		},
		error: function(response, ioArgs) {
			console.error("HTTP status code: ", ioArgs.xhr.status);
			return response;
		}
	});
}

function saveProperty(index) {
	document.forms["editModelForm"].method.value='saveProperty';
	document.forms["editModelForm"].savedIndex.value=index;
	document.forms["editModelForm"].submit();
}

function cancelProperty(index) {
	document.forms["editModelForm"].method.value='removeProperty';
	document.forms["editModelForm"].savedIndex.value=index;
	document.forms["editModelForm"].submit();
}

function changePropertyType(index, id) {
	document.forms["editModelForm"].method.value='selectType';
	document.forms["editModelForm"].savedIndex.value=index;
	document.forms["editModelForm"].selectedType.value=document.getElementById(id).selectedIndex;
	document.forms["editModelForm"].submit();
}

function addPotential(index) {
	document.forms["editModelForm"].method.value='addPotential';
	document.forms["editModelForm"].savedIndex.value=index;
	document.forms["editModelForm"].submit();
}
-->
</script>

<div id="mainPanel">
	<p class="error">
		<html:errors bundle="ERROR_RESSOURCE_KEY"/>
	</p>

	<html:form action="editModel">
		<html:hidden property="method" value="cancel"/>
		<html:hidden property="savedIndex" value=""/>
		<html:hidden property="selectedType" value=""/>

		<logic:equal value="<%=EditModelForm.MODE_CREATION%>" property="mode" name="editModelForm">
			<h2><bean:message key="model.edit.create"/></h2>
		</logic:equal>
		<logic:equal value="<%=EditModelForm.MODE_EDITION%>" property="mode" name="editModelForm">
			<h2><bean:message key="model.edit.modify"/></h2>
		</logic:equal>

		<p>
			<bean:message key="model.name"/> : <html:text property="name" name="editModelForm"/>
		</p>

		<h3><bean:message key="model.properties"/></h3>
		
		<table class="array">
			<caption>
				<a href="#" onclick="javascript:addProperty();">
					<bean:message key="model.edit.property.add"/>
				</a>
			</caption>
			<tr>
				<th><!-- Remove --></th>
				<th><bean:message key="model.property.name"/></th>
				<th><bean:message key="model.property.type"/></th>
				<th><bean:message key="model.property.specifications"/></th>
				<th><bean:message key="model.property.required"/></th>
				<th><!-- Save/modify --></th>
			</tr>
			
			<logic:empty name="editModelForm" property="properties">
				<tr><td colspan="6"><bean:message key="model.edit.property.none"/></td></tr>
			</logic:empty>
<%
	EditModelForm editModelForm = (EditModelForm) session.getAttribute("editModelForm");
	Iterator itProperties = editModelForm.getProperties().iterator();
	int propIndex = 0;
	while(itProperties.hasNext()) {
		Property prop = (Property) itProperties.next();
%>
			<tr>
				<td>
					<!-- Remove -->
					<a href="#" onclick="javascript:removeProperty(<%=propIndex%>)">
						<bean:message key="action.remove"/>
					</a>
				</td>
				<td>
					<!-- Property name -->
					<%=prop.getName()%>
				</td>
				<td>
					<!-- Property type -->
					<%=prop.getTypeName(editModelForm.getLocale())%>
				</td>
				<td>
					<!-- Property specifications -->
					<%=prop.getType().describe(editModelForm.getLocale())%>
				</td>
				<td>
					<!-- Property required ? -->
					<%=prop.getRequiredString()%>
				</td>
				<td>
					<a href="#" onclick="javascript:modifyProperty(<%=propIndex%>)">
						<bean:message key="action.modify"/>
					</a>
				</td>
			</tr>
<%
		propIndex++;
	}
%>
		</table>

		<p>
			<a href="javascript:validate();">
				<bean:message key="action.validate"/>
			</a>&nbsp;
			<a href="javascript:cancel()">
				<bean:message key="action.cancel"/>
			</a>
		</p>

<!-- Edition modal popup, name : dialogEdition  -->
<%@include file="popPropertyEdition.jsp"%>

	</html:form>
</div>

<%@include file="../../generic/inc/foot.jsp"%>
